
    layui.define(['layer', 'element', 'form', 'upload'], function (exports) {
        let layer = layui.layer,
            element = layui.element,
            upload = layui.upload;
        var obj = {
            render: function (e) {
                var files,
                     trAll,
                     tableList = e.tableList,
                     elem = e.elem,
                     bindAction = e.bindAction,
                     url = e.url,
                     size = e.size,
                     exts= e.exts,
                     field= e.field;

                function operate() {
                    $('.file-upper').click(function () {
                        $(this).siblings('.file-lower').removeClass('layui-hide');
                        let tr = $(this).parents('tr');
                        let tr_index = tr.index();
                        let temp = tr.html();
                        trAll = $(tableList+ ' tr');
                        let next = trAll.eq(tr_index - 1);
                        tr.html(next.html());
                        next.html(temp);
                        trPublic()
                        operate()
                    });
                    $('.file-lower').click(function () {
                        let tr = $(this).parents('tr');
                        let tr_index = tr.index();
                        let temp = tr.html();
                        trAll = $(tableList+ ' tr');
                        let next = trAll.eq(tr_index + 1);
                        tr.html(next.html());
                        next.html(temp);
                        trPublic()
                        operate()
                    });

                    $('.file-del').click(function () {
                        $(this).parents('tr').remove();
                        trPublic();
                    })
                }
                
                // 整理按钮显示隐藏
                function trPublic() {
                    trAll = $(tableList+ ' tr');
                    trAll.find('.file-upper').removeClass('layui-hide');
                    trAll.eq('1').find('.file-upper').addClass('layui-hide');
                    trAll.find('.file-lower').removeClass('layui-hide');
                    trAll.eq((trAll.length - 1)).find('.file-lower').addClass('layui-hide');
                }
                operate();
                // 获取文件大小
                function format_size(size, delimiter = '') {
                    $units = ['B', 'KB', 'MB', 'GB', 'TB', 'PB'];
                    for (var i = 0; size >= 1024 && i < 5; i++) {
                        size /= 1024;
                    }
                    return size.toFixed(2) + delimiter + $units[i];
                }
                // 获取文件类型
                function getType(file) {
                    sear = new RegExp('application')
                    if (file.type == '' || file.type == undefined || file.type == null || sear.test(file.type)) {
                        return file.name.split('.').pop();
                    }
                    return file.type.split('/').pop();
                }
                let uploadInst = upload.render({
                    elem: elem,
                    url: url,
                    data: {},
                    accept: 'file',
                    auto: false,
                    bindAction: bindAction,
                    multiple: true,
                    size:size,
                    exts:exts,
                    choose: function (obj) {
                        files = obj.pushFile();
                        $(tableList).removeClass("layui-hide");
                        $(bindAction).removeClass("layui-hide");
                        obj.preview(function (index, file, result) {
                            let tr = "<tr id='upload-" +
                                index + "'>" + "<td>" + file
                                .name +
                                "<input type='hidden' name='"+field+"[]' id='file_" +
                                index + "'></td>" +
                                "<td>" + format_size(file
                                    .size) +
                                "</td>" + "<td>" + getType(
                                    file) +
                                "</td><td class='status_" +
                                index + "'>等待上传</td><td>" +
                                "<button  class='layui-btn layui-mini layui-bg-cyan file-upper  layui-hide' type='button'>上移</button> <button class='layui-btn layui-mini layui-bg-blue file-lower  layui-hide '  type='button'>下移</button> <button class='layui-btn layui-mini file-reload  layui-hide' type='button'>重新上传</button>";

                            tr +=
                                "<button class='layui-btn layui-mini layui-btn-danger file-del'  id='"+index+"'type='button'>删除</button></td></tr>";

                            $(tableList).append(tr);
                            $(".file-reload").on("click",
                                function () {
                                    obj.upload(index, file);
                                });
                            $(".file-del").on("click",
                                function () {
                                    let delIndex = $(this).attr('id');
                                    delete files[delIndex];
                                })
                                operate();
                        });
                    },
                    allDone: function (obj) { //当文件全部被提交后，才触发
                        // console.log(obj.total); //得到总文件数
                        // console.log(obj.successful); //请求成功的文件数
                        // console.log(obj.aborted); //请求失败的文件数
                    },
                    progress: function (n, elem) {
                        // var percent = n + '%' //获取进度百分比
                        // console.log(percent);
                        // element.progress('demo',
                        //     percent); //可配合 layui 进度条元素使用

                        // //以下系 layui 2.5.6 新增
                        // console.log(
                        //     elem
                        // ); //得到当前触发的元素 DOM 对象。可通过该元素定义的属性值匹配到对应的进度条。
                    },
                    done: function (res, index, upload) { //上传后的回调
                        if (res.code == 1) { //上传成功
                            var tr = $('tr#upload-' + index),
                                tds = tr.children();
                            tr.find('.status_' + index).html(
                                "<span style='color:#5FB878;'>上传成功</span>"
                            );
                            tds.find(".file-reload").addClass("layui-hide"); //清空操作
                            trAll = $(tableList+ ' tr');
                            operate();
                            trPublic();

                            $('#file_' + index).val(JSON.stringify(res
                                .data));
                            delete files[index];
                            if($.isEmptyObject(files) ) {
                                $(bindAction).addClass("layui-hide");

                            }
                            return;
                        } else {
                            var tr = $(tableList).find('tr#upload-' +
                                    index),
                                tds = tr.children();
                            tds.find('.status_' + index).html(
                                "<span style='color:#FF5722;'>上传失败</span>"
                            )
                            tds.find(".file-reload").removeClass(
                                "layui-hide"); //清空操作
                            layer.msg(res.msg, {
                                icon: 2
                            });
                        }
                    },
                    error: function (index, upload) {
                        var tr = $(tableList).find('tr#upload-' +
                                index),
                            tds = tr.children();
                        tds.find('.status_' + index).html(
                            "<span style='color:#FF5722;'>上传失败</span>"
                        )
                        tds.find(".file-reload").removeClass(
                            "layui-hide"); //清空操作
                    }
                })
            }
        };
        exports('layFile', obj);

    })